 <template>
 	<view>
 		<Header type="back" />
		<view class="w-100 ab left0 bottom0 rounded-120 bg-f8ff" :class="'top'+bar_height">
			<scroll-view class="scroll-view_H uni-scroll" scroll-y="true" :lower-threshold="200">
				<view v-for="item in ticket_list" :key="item.id" class="px-3 mb-3 border-bottom">
					<view class="f-b-c">
						<view class="font32 t-0 f-s-c">{{item.name}}
							<view class="font24 t-3 ml-2 text-main" v-if="item.destroy">已领取</view>
						</view>
						
						<view class="font24 t-0 px-2-4 h64 circle12 f-c-c bg-theme" @click="show_qrcode(item)">查看二维码</view>
					</view>
					<view class="font28 py-1 t-3" v-if='item.destroy'>领取时间：{{item.destroyTime}}</view>
					<view class="font28 py-1 t-3" v-else>兑换时间：{{item.createTime}}</view>
				</view>
				<view class="w-100 t-a font24 t-4 pb-1" v-if="is_loading && ticket_list.length>0">没有更多了</view> 
				<view class="w-100 t-a font24 t-3 pt-12 pb-1" v-else>暂无数据</view>
				<view class="w-100 h180"></view>
			</scroll-view>
			
		</view>
		<uni-popup ref="qrcode_code" type="center">
			<view class="w696 h752 circle54 bg-f8ff ov-hd show0" v-if="details.show">
				<view class="w-100 h146 f-c-c bg-theme radius-54-botton font40 t-0 font600">
					{{ details.name}}
				</view>
				<view class="w-100 h606 bg-theme re">
					<view class="w-100 h-100 bg-f8ff radius-54-right px-6">
						<view class="w-100 h476 f-c-c">
							<u-qrcode ref="qrcode" canvas-id="qrcode" size="168" :value="details.qrCode"></u-qrcode>
						</view>
					</view>
					<view class="w-100 h100 f-c-c ab px-6 left0 bottom40">
						<view class="w270 h90 bg-theme font32 t-20 font600 f-c-c circle14" @click="set_cancel">关闭</view>
						<!-- <view class="w270 h90 bg-theme font32 t-20 font600 f-c-c circle14" @click="get_purchass()">确定</view> -->
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import Mixin from "../../../common/mixin.js"
	 import Header from "../../../components/header.vue"
	import List from "../order/components/list.vue"
	import { badgeReceiveRewardList }  from '../../../api/user.js'
	export default{
		mixins:[Mixin],
		components:{
			List,
			Header,
		},
		data(){
			return{
				bar_height:0,
				query:{
					pageSize:80,
					currentPage:1,
					payStatus:''
				},
				is_loading:true,
				ticket_list:[],
				details:{}
			}
		},
		created() {
			const { statusBarHeight,screenHeight } = uni.getStorageSync("systemInfo")
			let top = statusBarHeight / (uni.upx2px(100) / 100) // 状态栏高度
			let toprpx = top + 80 + 20 // 100为 header 20 为间距
			this.bar_height = toprpx //顶部高度
			this.set_badgeReceiveRewardList()
		},
		methods:{
			set_badgeReceiveRewardList(){
				let userInfo = uni.getStorageSync('userInfo')
				this.query.userId = userInfo.userId
				badgeReceiveRewardList(this.query).then(res=>{
					if(res.code == 0){
						this.ticket_list = res.body.records 
					}
				})
			},
			show_qrcode(item){
				this.$refs.qrcode_code.open()
				this.details = {...item,show:true}
			},
			set_cancel(){
				this.$refs.qrcode_code.close()
				this.details = {}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.scroll-view_H{
		position: absolute;
		top: 50rpx;
		left: 0;
		bottom: 0;
		right: 0;
		z-index: 9;
	}
	.rounded-120{
		border-radius: 0 80rpx 0 0;
	}
</style>
